.g-bd {
  overflow: hidden;
  .main {
    width: 708px;
    border-right: 1px solid #ccc;
    padding: 37px 30px 40px 39px;
    .detail-wrap {
      // overflow: hidden;
      .cvrwrap {
        .u-cover {
          width: 200px;
          height: 200px;
          float: left;
          position: relative;
          display: inline;
          margin: 0 -220px 0 0;
          img {
            display: block;
            width: 100%;
            height: 100%;
          }
          .msk {
            width: 208px;
            height: 208px;
            background-position: 0 -1285px;
            top: -4px;
            left: -4px;
          }
        }
      }
      .detail {
        // margin-top: 10px;
        width: 414px;
        text-align: left;
        .hd {
          margin-bottom: 12px;
          .u-icn {
            float: left;
            width: 54px;
            height: 24px;
            background-position: 0 -243px;
          }
          .tit {
            margin-left: 64px;
            position: relative;
            top: -1px;
            font-size: 20px;
            line-height: 24px;
            font-weight: normal;
          }
        }

        .user {
          margin: 0 0 20px;
          line-height: 35px;
          .avatar {
            margin-right: 10px;
            float: left;
            width: 35px;
            height: 35px;
            img {
              float: left;
              width: 35px;
              height: 35px;
            }
          }
          .name {
            float: left;
            line-height: 35px;
            a {
              color: #0c73c2;
            }
          }
          img {
            height: 13px;
            width: 13px;
            display: inline-block;
            vertical-align: middle;
          }
          .time {
            margin-left: 15px;
            color: #999;
          }
        }
        // .des {
        //   margin: 10px 0;
        //   color: #999;
        //   a {
        //     color: #0c73c2;
        //   }
        //   span {
        //     color: #333;
        //     margin-left: 5px;
        //   }
        //   .line {
        //     margin: 0 3px;
        //   }
        // }
        .tmhi-btn {
          // position: relative;
          margin-bottom: 25px;
          margin-right: -10px;
          height: 31px;
          .play {
            float: left;
            display: inline-block;
            width: 66px;
            height: 31px;
            padding-right: 5px;
            background-position: right -428px;
            // background: url(../../assets/images/button2.png) no-repeat right -428px;
            line-height: 31px;
            color: #fff;
            i {
              display: inline-block;
              width: 61px;
              height: 31px;
              line-height: 31px;
              background-position: 0 -387px;
              // background: url(../../assets/images/button2.png) no-repeat 0 -387px;
              .icon-play {
                display: inline-block;
                width: 20px;
                height: 18px;
                margin: 6px 2px 2px 8px;
                vertical-align: top;
                background-position: 0 -1622px;

                // background: url(../../assets/images/button2.png) no-repeat 0 -1622px;
              }
            }
          }
          .add {
            margin-right: 6px;
            float: left;
            display: inline-block;
            width: 31px;
            height: 31px;
            background-position: 0 -1588px;
            // background: url(../../assets/images/button2.png) no-repeat 0 -1588px;
          }
          .subscribed-count {
            float: left;
            height: 31px;
            line-height: 20px;
            min-width: 23px;
            margin-right: 6px;
            padding-right: 2px;
            cursor: pointer;
            font-family: simsun, \5b8b\4f53;
            background-position: right -1020px;
            // background: url(../../assets/images/button2.png) no-repeat right -1020px;
            i {
              display: block;
              height: 31px;
              line-height: 30px;
              min-width: 23px;
              cursor: pointer;
              padding-right: 2px;
              padding-left: 28px;
              background-position: 0 -977px;
              // background: url(../../assets/images/button2.png) no-repeat 0 -977px;
            }
          }
          .share-count {
            background-position: right -1020px;
            i {
              background-position: 0 -1225px;
            }
          }
          .download {
            background-position: right -1020px;
            i {
              background-position: 0 -2761px;
            }
          }
          .comment-count {
            background-position: right -1020px;
            i {
              background-position: 0 -1465px;
            }
          }
          .btn2 {
            float: left;
            height: 31px;
            line-height: 20px;
            min-width: 23px;
            margin-right: 6px;
            padding-right: 2px;
            cursor: pointer;
            font-family: simsun, \5b8b\4f53;
            // background: url(../../assets/images/button2.png) no-repeat;
            i {
              float: left;
              height: 31px;
              line-height: 30px;
              min-width: 23px;
              cursor: pointer;
              display: block;
              // background: url(../../assets/images/button2.png) no-repeat;
              padding-right: 2px;
              padding-left: 28px;
            }
          }
        }

        .tag {
          line-height: 22px;
          a {
            float: left;
            height: 22px;
            line-height: 22px;
            margin: 0px 10px 3px 0;
            padding: 0 9px 0 0;
            text-shadow: 0 1px #fdfdfd;
            background-position: right -27px;
            color: #777;
            text-decoration: none;
            i {
              position: relative;
              zoom: 1;
              padding: 0 3px 0 13px;
              background-position: 0 0;
              float: left;
              height: 22px;
              line-height: 22px;
            }
          }
        }
        .title {
          float: left;
          font-weight: normal;
          color: #666;
        }
        .desc {
          margin-top: 4px;
          line-height: 18px;
          color: #666;
          .flat {
            margin-top: 5px;
            a {
              color: #0c73c2;
              .u-icn {
                width: 11px;
                height: 8px;
                background-position: -65px -520px;
              }
              .u-icn-70 {
                background-position: -45px -520px;
              }
            }
          }
        }
      }
    }
    .tm-list {
      margin-top: 27px;
      padding-bottom: 40px;
      .tml-title {
        height: 33px;
        border-bottom: 2px solid #c20c0c;
        h3 {
          float: left;
          font-size: 20px;
          line-height: 28px;
          font-weight: normal;
        }
        .sub {
          float: left;
          margin: 9px 0 0 20px;
          color: #666;
        }
        .outer-link {
          float: right;
          margin-top: 4px;
          margin-right: 20px;
          .u-icn {
            width: 16px;
            height: 16px;
            background-position: -34px -863px;
          }
          a {
            margin-left: 10px;
            text-decoration: underline;
            color: #0c73c2;
          }
        }
        .play-count {
          float: right;
          margin-top: 5px;
          color: #666;
          strong {
            color: #c20c0c;
          }
        }
      }
      .tml-song-list {
        .tmls-wrap {
          :deep(table) {
            border: 1px solid #d9d9d9;
            tr {
              vertical-align: middle;
            }
            .rank-hd,
            .rank-td .hd {
              width: 54px;
            }
            .title-hd,
            .title-td {
              width: 236px;
            }
            .duration-hd,
            .duration-td {
              width: 111px;
              box-sizing: content-box;
            }
            .artist-hd,
            .artist-td .artist {
              width: 70px;
            }
            .album-hd,
            .album-td {
              width: 127px;
            }
            .album {
              display: inline-block;
              width: 107px;
              height: 18px;
            }
          }
        }
      }
      .play-list-more {
        width: 100%;
        height: 66px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        margin-top: 30px;
        margin-bottom: -10px;
        p {
          font-size: 13px;
          color: #333333;
        }
        .download {
          width: 120px;
          height: 30px;
          background-image: linear-gradient(90deg, #ff5a4c 0%, #ff1d12 100%);
          border-radius: 18px;
          line-height: 30px;
          font-size: 12px;
          color: #ffffff;
          text-align: center;
          text-decoration: none;
        }
      }
    }
  }
  .aside {
    position: relative;
    float: right;
    width: 270px;
    padding: 20px 40px 40px 30px;
    .u-hd3 {
      height: 23px;
      margin-bottom: 20px;
      border-bottom: 1px solid #ccc;
      color: #333;
      font-size: 100%;
    }
    .piclist {
      margin-bottom: 25px;
      overflow: hidden;
      li {
        float: left;
        margin-bottom: 10px;
        display: inline;
        padding: 0 0 10px 10px;
        width: 50px;
        height: 50px;
      }
    }
    .hotlist {
      li {
        margin-bottom: 10px;
        .coverImg {
          float: left;
          width: 50px;
          height: 50px;
          margin-right: 5px;
          img {
            width: 100%;
          }
        }
        p {
          width: 140px;
          height: 24px;
          line-height: 24px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          word-wrap: normal;
          .name {
            color: #000;
            font-size: 14px;
          }
          .by {
            color: #999;
          }
          .nickname {
            max-width: 106px;
            margin: 0 2px 0 4px;
            color: #666;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            word-wrap: normal;
          }
          .identity {
            height: 13px;
            width: 13px;
            display: inline-block;
            vertical-align: middle;
          }
        }
      }
    }
    .download {
      margin: 20px 0;
      padding-bottom: 20px;
      .dllist {
        height: 65px;
        margin-bottom: 10px;
        background: url(~@/assets/images/sprite.png);
        background-position: 0 -392px;
        li {
          float: left;
          a {
            display: block;
            width: 42px;
            height: 48px;
            text-indent: -9999px;
          }
          .ios {
          }
          .pc {
            width: 60px;
            margin: 0 26px 0 30px;
          }
          .aos {
          }
        }
      }
      p {
        color: #999;
      }
    }
    .wiki-edit {
      margin-bottom: 10px;
      display: block;
      text-align: left;
      line-height: 20px;
      img {
        vertical-align: middle;
        margin-top: -2px;
      }
    }
  }
}
